<%--
  Created by IntelliJ IDEA.
  User: 42585
  Date: 2021/1/27
  Time: 14:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>注册页</title>

    <script src=" webjars/jquery/3.5.1/jquery.js"></script>
    <script src="webjars/bootstrap/4.5.3/js/bootstrap.js"></script>
    <link rel="stylesheet" type="text/css" href="webjars/bootstrap/4.5.3/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/register.css">

    <script>
        //异步查询用户名是否存在
        //若想发送json数据let u = JSON.stringify(obj);url: "http://localhost:8080/AJXTest_war/login",contentType: "application/json;charset=UTF-8",
        //不写默认k-v模式数据
        $(function () {
            $('#input-username').on('change', function () {
                let username = $(this).val();
                $.ajax({
                    method: "post",
                    url: "${pageContext.request.contextPath }/usernameExit",
                    data: {
                        username: username
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result.code === 200) {
                            $('#name-span').text("可以使用");
                        } else {
                            $('#name-span').text("用户名重复");
                        }
                    }
                });
            })
        })

        //判断二次输入密码是否正确
        $(function () {
            $('#yes').on('change', function () {
                let passfirst = $('#word').val();
                let passsceond = $('#yes').val();
                if (passfirst == passsceond) {
                    $('#ok-span').text("可以使用");
                } else {
                    $('#ok-span').text("密码错误");
                }
            });
        });

        $(function () {
            $('#yes').on('change', function () {
                if ($('#inn').attr('disabled') == "disabled" && $('#name-span').text() == "可以使用" && $('#ok-span').text() == "可以使用"&&$('input:radio:checked').val()!=null) {
                    /* $('#inn').show()/hide();*/
                    //判断过后使按钮是否能够使用
                    $('#inn').removeAttr('disabled');
                }
            })
        })
        $(function () {
            $('#input-username').on('change', function () {
                if ($('#inn').attr('disabled') == "disabled" && $('#name-span').text() == "可以使用" && $('#ok-span').text() == "可以使用"&&$('input:radio:checked').val()!=null) {
                    /* $('#inn').show()/hide();*/
                    //判断过后使按钮是否能够使用
                    $('#inn').removeAttr('disabled');
                }
            })
        })
        $(function () {
            $('#checkbox1').on('change', function () {
                if ($('#inn').attr('disabled') == "disabled" && $('#name-span').text() == "可以使用" && $('#ok-span').text() == "可以使用"&&$('input:radio:checked').val()!=null) {
                    /* $('#inn').show()/hide();*/
                    //判断过后使按钮是否能够使用
                    $('#inn').removeAttr('disabled');
                }
            })
        })
        $(function () {
            $('#checkbox2').on('change', function () {
                if ($('#inn').attr('disabled') == "disabled" && $('#name-span').text() == "可以使用" && $('#ok-span').text() == "可以使用"&&$('input:radio:checked').val()!=null) {
                    /* $('#inn').show()/hide();*/
                    //判断过后使按钮是否能够使用
                    $('#inn').removeAttr('disabled');
                }
            })
        })

        function registerfirst() {
            let username = $('#input-username').val();
            let password = $('#word').val();

            //通过是否选中判断注册的权限
            if ($('input:radio:checked').val() === "option1") {
                $.ajax({
                    method: "put",
                    url: "${pageContext.request.contextPath}/adduser",
                    data: {
                        username: username,
                        password: password,
                        usernamea: null,
                        passworda: null,
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result.code === 200) {
                            window.location.href = "${pageContext.request.contextPath}/loginui";
                        } else {
                            alert("注册失败");
                            window.location.href = "${pageContext.request.contextPath}/loginui";
                        }
                    },
                    error() {
                        window.location.href = "${pageContext.request.contextPath}/false";
                    }
                })
            } else if ($('input:radio:checked').val() === "option2") {
                $.ajax({
                    method: "put",
                    url: "${pageContext.request.contextPath}/adduser",
                    data: {
                        username: null,
                        password: null,
                        usernamea: username,
                        passworda: password
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result.code === 200) {
                            window.location.href = "${pageContext.request.contextPath}/loginui";
                        } else {
                            alert("注册失败");
                            window.location.href = "${pageContext.request.contextPath}/loginui";
                        }
                    },
                    error() {
                        window.location.href = "${pageContext.request.contextPath}/false";
                    }
                })
            }
        }

        function returnlogin() {
            window.location.href = "${pageContext.request.contextPath}/loginui"
        }
    </script>
</head>
<body>
<form id="add-form" action="/" method="post">

    <ul>
        <li>
            <div class="input-group" id="yong">
                <span class="input-group-addon"></span>
                <input type="text" name="username" class="form-control" aria-label="..." placeholder="请输入用户名"
                       id="input-username"/>
            </div>
            <span id="name-span"></span>
        </li>
        <li>
            <div class="input-group" id="mi">
                <span class="input-group-addon"> </span>
                <input type="password" name="password" class="form-control" aria-label="..." placeholder="请输入密码"
                       id="word"/>
            </div>
            <span id="ok-span"></span>
        </li>
        <li>
            <div class="input-group" id="mir">
                <span class="input-group-addon"> </span>
                <input type="password" name="password1" class="form-control" aria-label="..." placeholder="请确认密码"
                       id="yes"/>
            </div>
        </li>

        <div id="checkone">
            <div class="has-warning">
                <div class="checkbox">
                    <label>
                        <input type="radio" id="checkbox1" class="check_Id" name="check_Id" value="option1">
                        管理员
                    </label>
                </div>
            </div>
            <div class="has-warning">
                <div class="checkbox">
                    <label>
                        <input type="radio" id="checkbox2" class="check_Id" name="check_Id" value="option2">
                        医生
                    </label>
                </div>
            </div>
        </div>

        <li class="inset">
            <div class="btn-group btn-group-justified" role="group" aria-label="..." id="nnn">
                <div class="btn-group" role="group" id="in">
                    <input type="button" value="注册" class="btn btn-success" onclick="registerfirst()" id="inn"
                           disabled="disabled"/>
                </div>
                <div class="btn-group" role="group" id="set">
                    <input type="button" value="返回" class="btn btn-primary" onclick="returnlogin()"/>
                </div>
            </div>
        </li>
    </ul>
</form>
</body>
</html>
